import React from 'react';
import {inject, observer} from 'mobx-react';
import {Modal,Icon} from 'weaver-mobile';
import * as VariableKeys from "../../constants/variableKey";
import * as SignUtil from "../../util/SignUtil";

/**
 * 录音
 */
@inject('wfSignInputStore')
@observer
export default class Main extends React.Component {

    constructor(props) {
        super();
        this.state = {
            status: false // true 录音中
        }
    }

    render() {
        const {status} = this.state;
        const visible = SignUtil.getVariableMapVal(VariableKeys.SIGN_SOUND_INPUT_MODAL_VISIBLE, false);
        const bottomBtnTitle = status ? '结束' : '开始';
        return (
            <Modal
                visible={visible}
                maskClosable={false}
                transparent
                footer={[{
                    text: status ? '结束' : '开始', onPress: () => {
                        this.voice()
                    }
                }]}
                className={'wf-sign-sound-input'}
            >
                <div className={'wf-sign-sound-input-content'}>
                    <Icon type={'voice'} color={'#5AB4FA'}/>
                </div>
                <div className={'wf-sign-sound-input-tip'}>
                    {`请按开始键说话`}
                </div>
            </Modal>
        )
    }

    voice() {
        const {wfSignInputStore} = this.props;
        const {controlVariableMap, Adapter, isForwad,saveSignAnnex} = wfSignInputStore;
        const {status} = this.state;
        if (status) {
            const soundResourceKey = isForwad ? VariableKeys.FORWARD_SIGN_SOUND_RESOURCE : VariableKeys.SIGN_SOUND_RESOURCE;
            const soundDatas = SignUtil.getVariableMapVal(soundResourceKey, []);
            Adapter.voiceStop((rsource) => {
                console.log("rsource",rsource);
                saveSignAnnex(1,rsource);
            });
            controlVariableMap(VariableKeys.SIGN_SOUND_INPUT_MODAL_VISIBLE, false);
        } else {
            Adapter.voice();
        }
        this.setState({status: !status});
    }
}